$(function () {

  // 给登录、注册切按钮绑定点击事件，用于两者之间的切换
  $('#link_reg').on('click', function () {
    $('.login-box').hide()
    $('.reg-box').show()
  })

  $('#link_login').on('click', function () {
    $('.login-box').show()
    $('.reg-box').hide()
  })


  // for用于获取到layui中的表单属性
  var form = layui.form
  var layer = layui.layer
  form.verify({
    // 以数组的方式，对表单进行密码的验证
    pwd: [/^[\S]{6,12}$/, '密码必须6到12位，且不能出现空格'],
    // 以函数的方式对重复密码进行验证
    repwd: function (value) {
      // 用属性选择器的方式，选择到密码框中的值
      var pwd = $('.reg-box [name=password]').val()
      // 判断用户输入在重复密码中的值和第一次输入密码的值是否相等
      if (pwd !== value) {
        return '两次密码输入不一致'
      }
    }
  })


  $('#form_reg').on('submit', function (e) {
    // 1、阻止表单默认提交行为 
    e.preventDefault()
    // 2、发起ajax的 post请求, 用户注册页面
    var data = {
      username: $('#form_reg [name=username]').val(),
      password: $('#form_reg [name=password]').val()
    }

    // 将发起post请求需要传递的参数data抽离出来
    $.post('/api/reguser', data, function (res) {
      // 如果请求回来的st值不等于0，则返回用户注册失败的消息
      if (res.status !== 0) {
        return layer.msg(res.message)
      }
      // 如果用户注册成功了，显示消息，并且自动调用去登录按钮的点击事件，跳转到登录页面
      layer.msg('注册成功，请登录!')
      $('#link_login').click()

    })
  })


  // 完成用户登录页面的  接口 调用
  $('#form_login').on('submit', function (e) {
    e.preventDefault()
    var username = $('.login-box [name=username]').val()
    var password = $('.login-box [name=password]').val()
    $.ajax({
      type: 'post',
      url: '/api/login',  
      data: {
        username: username,
        password: password
      },
      success: function (res) {
        // console.log(res);
        if (res.status !== 0) {
          return layer.msg(res.message)
        }
        localStorage.setItem('token', res.token)
        location.href = '/index.html'
      }
    })
  })


})